<template>
	<view class="container">
		<view v-if="nav_type=='4'" class="padding-sm">
			<hui-parser :html="info.detailHtml" />
		</view>
		<view v-else class="">
			<view class="flex justify-start align-center padding margin-left margin-right">
				<image :src="info.headImg" mode="" class="round" style="width: 80rpx;height: 80rpx;"></image>
				<view class="text-15 text-bold margin-left-xs">
					{{info.nickName}}
				</view>
				<view @click="submitAttention(info.userId)" class="text-sm margin-left-xs color round bg-color5"
					style="padding: 10rpx 18rpx;background: #FFDEC0;">

					<text v-if="info.follow">已关注</text>
					<text v-else>关注</text>
				</view>
			</view>
			<view v-if="info.fileType==2" class="bg-white padding flex justify-between align-center margin-sm radius10">
				<view class="flex justify-start align-center">
					<image :src="baseUrl + '/static/businessschool1.png'" mode=""
						style="width: 66rpx;height: 90rpx;min-width: 66rpx;"></image>
					<view class="margin-left">
						<view class="text-15 text-bold text-333">
							{{info.title}}
						</view>
						<view class="text-sm text-666 margin-top-xs">
							{{info.typeName}}
						</view>
						<view class="text-xs text-999 margin-top-sm">
							{{info.createTime}}
						</view>
					</view>
				</view>

				<view class="flex justify-start align-center">
					<view class="flex flex-direction justify-center align-center">
						<image :src="baseUrl + '/static/read.png'" mode="" style="width: 48rpx;height: 48rpx;">
						</image>
						<view class="text-999 text-xs margin-top-sm">
							阅读{{info.readNum}}
						</view>
					</view>
					<view class="flex flex-direction justify-center align-center margin-left"
						@click="onDown(info.fileUrl)">
						<image :src="baseUrl + '/static/download.png'" mode="" style="width: 48rpx;height: 48rpx;">
						</image>
						<view class="text-999 text-xs margin-top-sm">
							下载{{info.downNum}}
						</view>
					</view>
				</view>

			</view>
			<view v-else class="bg-white radius10 margin-sm padding">
				<view class="text-15 text-333">
					工程案例
				</view>
				<view class="flex flex-wrap justify-start margin-top position-relative">
					<!-- 	<view v-if="shopProject.length>=9" class="text-white flex justify-center align-center" style="background: rgba(0,0,0,.6);width: 210rpx;height: 210rpx;border-radius: 6rpx;position: absolute;right: 0;bottom: 0rpx;z-index: 2;">
					更多
				</view> -->
					<image :src="item" class="margin-top-xs" v-for="(item,index) in shopProject"
						:class="{'margin-left-xs':(index+3)%3!=0}" mode="" style="width: 210rpx;height: 210rpx;"
						@click="ViewImage(item)">
					</image>

				</view>
			</view>
			<view class="bg-white radius10 padding margin-sm">
				<view class="text-15 text-bold">
					方案描述
				</view>
				<view class="text-sm text-666 margin-top">
					{{info.desc}}
				</view>
			</view>

		</view>
		<view class="bg-white radius10 padding margin-sm" v-if="comment.length>0">
			<view class="text-15 text-bold">
				评论
			</view>
			<view class="text-sm text-666 margin-top flex justify-start" v-for="item in comment">
				<image :src="item.headImg" mode="" class="round" style="width: 60rpx;height: 60rpx;min-width: 60rpx;">
				</image>
				<view class="margin-left-xs f-grow1 solid-bottom padding-bottom-sm">
					<view class="text-df text-999">
						{{item.nickName}}
					</view>
					<view class="margin-top-xs">
						{{item.commentMsg}}
					</view>
					<view class="margin-top text-sm">
						{{item.createTime}}
					</view>
				</view>
			</view>
		</view>
		<view class="" style="height: 110rpx;">

		</view>
		<view class="f-fooder bg-white flex justify-between align-center padding-left-sm padding-right-sm">
			<input type="text" value="" v-model="commentMsg" confirm-type="done" @confirm="submitComment"
				class="round text-df bg-F4F4F4 padding-sm" placeholder-class="" placeholder="写评论..." />
			<view class="flex justify-start align-center" @click="submitKeep">
				<image v-if="info.collected" :src="baseUrl + '/static/like3.png'" mode="" class="round"
					style="width: 60rpx;height: 60rpx;min-width: 60rpx;"></image>
				<image v-else :src="baseUrl + '/static/like4.png'" mode="" class="round"
					style="width: 60rpx;height: 60rpx;min-width: 60rpx;"></image>
				<view class="text-666 text-sm margin-left-xs">
					{{info.collectionNum}}
				</view>
			</view>
			<view class="flex justify-start align-center"
				@click="toPage('/filePage/pages/recommend/recommend?type=2' +'&id=' + programmeId)">

				<image :src="baseUrl + '/static/comment.png'" mode="" class="round"
					style="width: 60rpx;height: 60rpx;min-width: 60rpx;"></image>
				<view class="text-666 text-sm margin-left-xs">
					{{info.commentNum}}
				</view>
			</view>
			<!--  #ifdef MP-WEIXIN-->
			<view class="flex justify-start align-center" @click="onShare">
				<image :src="baseUrl + '/static/share2.png'" mode="" class="round"
					style="width: 60rpx;height: 60rpx;min-width: 60rpx;"></image>
				<view class="text-666 text-sm margin-left-xs">
					{{info.returnNum}}
				</view>
			</view>
				<!--  #endif -->
			<!--  #ifdef APP-PLUS-->
			<view class="flex justify-start align-center" @click.stop="tapShare">
				<image :src="baseUrl + '/static/share2.png'" mode="" class="round"
					style="width: 60rpx;height: 60rpx;min-width: 60rpx;"></image>
				<view class="text-666 text-sm margin-left-xs">
					{{info.returnNum}}
				</view>
			</view>
			<!--  #endif -->

		</view>
		<l-file ref="lFile"></l-file>
		<!--  #ifdef MP-WEIXIN-->
		<view @click="onShare" v-if="is_share" class="flex justify-end"
			style="background: rgba(0,0,0,.5);position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 100000;">
			<image :src="baseUrl + '/static/share3.png'" mode=""
				style="width: 432rpx;height: 280rpx;margin-right: 100rpx;"></image>
		</view>
		<!--  #endif -->
		
		


	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl: this.$config.baseUrl,
				info: {},
				programmeId: '',
				is_share: false,
				commentMsg: '',
				comment: [],
				nav_type: '',
				url: this.$api.programme_detail,
				shopProject: []
			};
		},
		onLoad(options) {
			console.log(options)
			if (options.id) {
				this.programmeId = options.id

				// 
			}
			console.log(options.nav_type)
			// if (options.nav_type) {
			// 	this.nav_type = options.nav_type
			// 	if (options.nav_type == '4') {
			// 		this.url = this.$api.training_details
			// 	}

			// }
			this.getComment()
			this.getInfo()
		},
		onShareAppMessage: function(res) {
			this.onShare()
			this.getforward()
		},
		onShareTimeline: function() {
			this.onShare()
			this.getforward()
		},
		methods: {
			toPage(url) {
				this.$util.openNewPage(url)
			},
			ViewImage(e) {
				uni.previewImage({
					urls: this.shopProject,
					current: e
				});
			},
			// 分享
			onShare() {
				this.is_share = !this.is_share
			},
			/* 保存 */
			async onDown(url) {
				let that = this
				// let url = 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2534506313,1688529724&fm=26&gp=0.jpg';
				// this.$refs.lFile.download(url,'save', this.info.fileName + '.docx').then(path=>{
				// 	console.log(path)
				// 	that.$refs.lFile.open(path);
				// }); 

				uni.showModal({
					title: '提示',
					content: '下载链接已复制请前往浏览器下载',
					success: function(res) {
						if (res.confirm) {
							uni.setClipboardData({
								data: 'https://super.zoyob.com/util/download/url?netAddress=' +
									url,
								success: function() {
									that.getupdate()
									// console.log('success');
								}
							});
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
				// this.$util.openNewPage(
				//   // "/filePage/pages/open-link/open-link?url=https://super.zoyob.com/mall-util/download/url?netAddress=" + url
				//   "/filePage/pages/open-link/open-link?url=" + url + '&download=1'
				// );
				// const [err, res] = await this.$get(this.$api.download_url, {
				// 	netAddress: url,
				// 	isOnLine:false
				// })
				// if (res) {
				// 	console.log(res)
				// 	// this.$util.msg(res.message)
				// 	// this.getInfo()
				// }

				// uni.downloadFile({
				// 	url: url, //仅为示例，并非真实的资源
				// 	success: (res) => {
				// 		if (res.statusCode === 200) {
				// 			console.log(res.tempFilePath)
				// 			uni.saveFile({
				// 				tempFilePath: res.tempFilePath,
				// 				success: function(res) {
				// 					console.log(res)
				// 					var savedFilePath = res.savedFilePath;
				// 					console.log(res.savedFilePath)
				// 					that.getupdate()
				// 					// uni.openDocument({
				// 					// 	filePath: savedFilePath,
				// 					// 	success: (res) => console.log('成功打开文档'),
				// 					// 	fail(err) {
				// 					// 		that.$util.msg('请下载相关文件应用' + err)
				// 					// 	}
				// 					// })
				// 					// console.log('保存成功' + savedFilePath);
				// 				},
				// 				fail(err) {
				// 					console.log('保存失败' +err)	
				// 				}
				// 			});

				// 		}
				// 	}
				// })
			},
			async submitKeep() {
				// if (this.nav_type) {
				// 	return this.trainingKeep()
				// }
				const [err, res] = await this.$get(this.$api.programme_collection, {
					programmeId: this.info.id
				})
				if (res) {
					// console.log(res)
					this.$util.msg(res.message)
					this.getInfo()
				}
			},
			// async trainingKeep() {
			// 	const [err, res] = await this.$get(this.$api.training_collection, {
			// 		id: this.info.id
			// 	})
			// 	if (res) {
			// 		// console.log(res)
			// 		this.$util.msg(res.message)
			// 		this.getInfo()
			// 	}
			// },
			async getComment() {
				let type
				if (this.nav_type == '4') {
					type = 3
				} else {
					type = 2
				}
				const [err, res] = await this.$get(this.$api.comment_list, {
					videoId: this.programmeId,
					type: type,
					pageNum: 1,
					pageSize: 3
				})
				if (res) {
					this.comment = res.data.list
					// console.log(res)
				}
			},
			async getInfo() {
				let param
				if (this.nav_type == '4') {
					param = {
						id: this.programmeId
					}
				} else {
					param = {
						programmeId: this.programmeId
					}

				}
				const [err, res] = await this.$get(this.url, param)
				if (res) {
					this.info = res.data
					if (this.nav_type == '4') {
						uni.setNavigationBarTitle({
							title: this.info.title
						})
					} else {
						this.shopProject = res.data.fileUrl.split(',')
					}
					// console.log(res.data)
				}
			},
			async getupdate() {

				const [err, res] = await this.$get(this.$api.programme_updateNum, {
					programmeId: this.programmeId,
					type: 2
				})
				if (res) {
					// this.info = res.data
					// console.log(res.data)
					this.getInfo()
				}
			},
			async getforward() {
				if (this.nav_type == '4') {
					return this.trainingforward()
				}
				const [err, res] = await this.$get(this.$api.programme_forward, {
					programmeId: this.programmeId
				})
				if (res) {
					// this.info = res.data
					// console.log(res.data)
					this.getInfo()
				}
			},
			async trainingforward() {
				const [err, res] = await this.$get(this.$api.training_forward, {
					id: this.programmeId
				})
				if (res) {
					// this.info = res.data
					// console.log(res.data)
					this.getInfo()
				}
			},
			async submitAttention(followId) {
				let that = this
				let type
				if (this.nav_type == '4') {
					type = 3
				} else {
					type = 2
				}
				const [err, res] = await this.$get(this.$api.follow_addOrDel, {
					followId: followId,
					type: type
				})
				if (res) {
					this.$util.msg(res.message)
					this.getInfo()
					// console.log(res)
				}
			},
			async submitComment() {
				let that = this
				let type
				if (this.nav_type == '4') {
					type = 3
				} else {
					type = 2
				}
				const [err, res] = await this.$post(this.$api.comment_add, {
					videoId: this.programmeId,
					type: type,
					commentMsg: this.commentMsg
				})
				if (res) {
					this.$util.msg(res.message)
					this.commentMsg = ''
					this.getComment()
					this.getInfo()
					// console.log(res)
				}
			},
			tapShare(e) {
				e.stopPropagation();
				uni.share({
					provider: 'weixin',
					scene: "WXSceneSession",
					type: 5,
					imageUrl: '/static/default.png',
					title: '佐佑帮小程序',
					miniProgram: {
						id: 'gh_ee4f5c078afc',
						path: `/pages/home/home?code=${uni.getStorageSync('userInfo').recommendCode}`,
						type: 0,
						webUrl: 'http://uniapp.dcloud.io'
					},
					success: ret => {
						console.log(JSON.stringify(ret));
						this.getforward()
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.f-fooder {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 110rpx;

		input {
			width: 256rpx;
			min-width: 256rpx;
			height: 78rpx;
		}
	}
</style>
